<template>
<Card dis-hover v-bind="$attrs" class="FieldsCard" v-if="isShow" :padding="0">
    <template #title>
        <h4 :id="comName"><span v-html="headerTitle"></span></h4><a :href="'#'+comName" :name="comName"></a>
    </template>
    <template slot="extra">
        <slot name="but"></slot>
    </template>

    <slot></slot>

</Card>
</template>

<script>
export default {
    name: "FieldsCard",
    inject: ["action", "modules"],
    props: {
        title: {
            type: String,
            default: ""
        },
        isAuth: {
            type: Boolean,
            default: false
        }
    },
    data() {
        return {
            auth: {},
            headerTitle: this.title,
            isShow: false,
            comName: ""
        }
    },
    watch: {
        modules(val, oldVal) {
            if (this.isAuth) {
                this.module = this.modules[this.$parent.$options._componentTag]
                if (this.module) {
                    if (this.module.name && this.module.name != "") {
                        this.headerTitle = this.module.name
                    }

                    this.isShow = true
                    this.module.show = (status) => {
                        this.isShow = status
                    }

                    this.module.component = this.$slots.default[0]
                }
            }else{
                this.isShow = true
            }
        }
    },
    created() {
        this.isShow = !this.isAuth
    },
    mounted() {
        this.comName = this.$parent.$options._componentTag
    },
}
</script>

<style lang="less" scoped>
.FieldsCard {
    border-radius: 0px;

    /deep/ .ivu-card-extra .ivu-btn,
    /deep/ .ivu-card-extra .ivu-radio-group {
        margin-left: 10px;
        margin-top: -8px;
    }

    /deep/ .ivu-upload {
        display: inline-block;
    }

    /deep/.ivu-card-head p span {
        border-left: 2px solid #E60312;
        padding-left: 10px;
    }
    /deep/ .ivu-table-wrapper-with-border{
        border: 0px;
    }

    /deep/ .ivu-table:before{
        content: '';
        background: #FFF;
    }
    /deep/ .ivu-table:after{
        content: '';
        background: #FFF;
    }

    /deep/ .search{
        margin-bottom: 0px;
        border-width: 0px 0px 1px 0px;
    }
    /deep/ .search .ivu-collapse-header{
        display: none;
    }
}
</style>
